<template>
  <div class="wrapper">
     <home-header ></home-header>
     <home-swiper :swiperList='swiperList'></home-swiper>
     <home-icon :iconList="iconList"></home-icon>
     <home-recommend :recommendList = "recommendList"></home-recommend>
     <home-weekend :recommendList = "weekendList"></home-weekend>
      <!-- <div class="odiv">
          <i class="iconfont">&#xe632;</i>
          <i class="iconfont">&#xe624;</i>
          <i class="iconfont">&#xe8f7;</i>
      </div> -->
  </div>
</template>

<script>
import homeHeader from './components/header'
import homeSwiper from './components/swiper'
import homeIcon from './components/icon'
import homeRecommend from './components/recommend'
import homeWeekend from './components/weekend'
export default {
  data(){
    return {
      swiperList:[],
      iconList:[],
      weekendList:[],
      recommendList:[]
    }
  },
  components:{
   homeHeader,
   homeSwiper,
   homeIcon,
   homeRecommend,
   homeWeekend
  },
  watch:{},
  computed:{},
  methods:{
    getData(){
      let self = this;
      this.axios.get('/api/index.json').then((res)=>{
        let data = res.data
        if(data.ret && data.data){
          this.swiperList = data.data.swiperList
          this.iconList = data.data.iconList
          this.recommendList = data.data.recommendList
          this.weekendList = data.data.weekendList
        }
        
      })
    }
  },
  created(){
    
  },
  mounted(){
    this.getData()
  }
}
</script>
<style lang="stylus" scoped>
.wrapper
 .odiv
   background :blue
   width : 100px
   height : 100px
</style>

